import Observer from "../common/Observer";
import pxmu from 'pxmu'

// 定义用户名锁 密码锁
let usernameLock=false;
let passwordLock=false;

// 获取元素
let registDemo=document.getElementById('registDemo')
let registCloseBtn=document.getElementById('registCloseBtn')
let registUsername=document.getElementById('registUsername')
let registPassword=document.getElementById('registPassword')
let registBtn=document.getElementById('registBtn')
let registOut=document.getElementById('registOut')


// 注册面板显示
Observer.on('regist-show',function(){
    registDemo.classList.remove('d-none')
})
// 注册面板隐藏
Observer.on('regist-hide',function(){
    registDemo.classList.add("d-none")
})
// 内容显示
Observer.on('content-show',function(){
    content.classList.remove('d-none')
})
// 内容隐藏
Observer.on('content-hide',function(){
    content.classList.add('d-none')
})


// 关闭按钮
registCloseBtn.onclick=function(){
    Observer.emit('regist-hide')
    console.log(registDemo);
    // 显示首页
    Observer.emit('content-show')
    // 后退
    location.href='/'
    // registOut.style.backgroundColor='red'
    
}


// 判断用户名 用户名失去焦点
registUsername.onblur=async function(){
    let username=this.value;
    if(!/^[a-zA-Z0-9_-]{4,16}$/.test(username)){
        pxmu.fail('用户名不符合规范：4到16位（字母，数字，下划线，减号）')
        usernameLock=false
        return
    }
    // 拼接字符串
    let querystring=`username=${username}`
    // 如果通过检测，发送检测用户名请求
    let res= await fetch("/guyun/checkusername?"+querystring)
    let {error,data}=await res.json();
    if(!error){
        pxmu.success(data);
        usernameLock=true;
        return;
    }
    pxmu.fail(data)
}


// 判断密码 密码失去焦点
registPassword.onblur= function(){
    let password=this.value;
    if(!/^[a-zA-Z0-9_-]{4,16}$/.test(password)){
        pxmu.fail('密码不符合规范：4到16位（字母，数字，下划线，减号）')
        passwordLock=false
        return
    }
    passwordLock=true
    pxmu.success('可以使用');
}


registBtn.onclick=async function(e){
    e.preventDefault()
    if(!usernameLock||!passwordLock){
        pxmu.fail('用户名或者密码不正确')
    }
    let res=await fetch('/guyun/regist',{
        method:"post",
        body: "username=" + registUsername.value + "&password=" + registPassword.value,
        headers:{
            "Content-type": "application/x-www-form-urlencoded"
        }
    })
    let {error,data}=await res.json()
    if(!error){
        console.log('注册成功');
        Observer.emit('regist-hide')
        Observer.emit('login-show')
        
        pxmu.success(data)
        return;
    }
    console.log('注册失败');
    pxmu.fail(data)
}
    
